
const webpack = require('webpack');
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin')
const ExtractTextPlugin = require("extract-text-webpack-plugin");

module.exports = {
	devtool:'source-map',
	entry:{
		main:path.resolve(__dirname, './app/config/app.js')
	},
	output:{
		path: path.resolve(__dirname, './webBloger'),
		filename:'[name].js'
	},
	devServer:{
		hot:true,
		port:7140,
		inline:true
	},
	module:{
		rules:[{
			test:/\.css$/,use:ExtractTextPlugin.extract({
				fallback:'style-loader',
				use:'css-loader'
			})
		},{
			test:/\.(png|jpg|jeg|gif|svg)$/,
			use:['url-loader?limit=100&name=image/[name].[ext]']
		},{
			test:/\.js$/,
			exclude:/node_modules/,
			loader:'babel-loader'
		},{
			test:/\.vue$/,
			use:'vue-loader'
		}]
	},
	resolve:{
		extensions: ['.vue','.js','.json'],
		alias:{
			'app': path.resolve(__dirname, './app'),
			'assets': path.resolve(__dirname,'./app/aseets'),
			'components': path.resolve(__dirname,'./app/components'),
			'config': path.resolve(__dirname, './app/config'),
			'active': path.resolve(__dirname, './app/active')
		}
	},
	plugins:[
		new webpack.HotModuleReplacementPlugin(),
		new ExtractTextPlugin({
			filename:'[name].css'
		}),
		new HtmlWebpackPlugin({
			template: './app/index.html',
			inject: true,
			minify:{
				removeComponents:true,
				collapseWhitespace:false
			}
		})
	]
}
